﻿<%@ Page Language="C#" MasterPageFile="~/page/DefaultMaster.master" AutoEventWireup="true" CodeFile="Test.aspx.cs" Inherits="Test" Title="无标题页" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>

<asp:Content ID="Content2" runat="server" contentplaceholderid="cph_path">
    <span><a href="#">系统首页</a> &gt; <a href="#">房源管理</a></span>
</asp:Content>


<asp:Content ID="Content3" runat="server" contentplaceholderid="cph_headtitle">
    测试页面
</asp:Content>








<asp:Content ID="Content4" runat="server" contentplaceholderid="cph_main">
<style type="text/css">
dl
{
	height:30px;
	line-height:30px;
	width:100%;
}
dt
{
	width:80px;
	float:left;
	text-align:right;
}
dd
{
	width:200px;
	float:left;
	text-align:left;
	text-indent:2px;
}
</style>

<div style="">
<div style="height:30px; line-height:30px; margin-bottom:5px; background-color:#fff; border:solid 1px #ccc;">
    总共2条记录
</div>
<div style="border:solid 1px #999; ">
<div style="border-bottom:dotted 1px #ccc; vertical-align:top;">
    <ul>
        <li id="x_1" style=" padding:5px; height:90px; ">
            <div style="float: left; width: 20px;">
                <input type="checkbox"/><span class="x-multigrid-expand"></span>
            </div>
            <div style="float:left; overflow:hidden;">
                <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
                <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
                <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
            </div>
            <div style="float:right; width:60px;  padding:5px;">
                <dl>
                    <dd><input type="button" value="添加" /></dd>
                </dl>
                <dl>
                    <dd><input type="button" value="添加" /></dd>
                </dl>
                <dl>
                    <dd><input type="button" value="添加" /></dd>
                </dl>
            </div>
        </li>
        <li id="x_2" style="display:none; height:100px; padding-left:25px;">
            <div>
            <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
                <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
                <dl>
                    <dt>房源编号：</dt>
                    <dd>CX0000000000001</dd>
                    <dt>房源地址：</dt>
                    <dd>淮海中路1101号</dd>
                </dl>
                </div>
        </li>
    </ul>
</div>  
</div>        
</div>

<div style=" margin-top:20px;"></div>
<input id="btn_lock" value="lock" type="button" /> <input id="col_num" value="1" />
<div style="border:solid 1px #ccc; height:300px;">
    <div id="locklist" style="float:left; width:101px; border-right:solid 1px #CEE7FF; height:100%;">
    
        <table id="locktab" class="tabsorternew" style="width:100px;" cellspacing="1";>
            <thead>
                <tr>                
                    <th style="width:100px;">序号</th>
                </tr>
            </thead>
            <tbody>
                <tr>                    
                    <td>CXSH000001</td>
                </tr>
                <tr>                    
                    <td>CXSH000001</td>
                </tr>
                <tr>                    
                    <td>CXSH000001</td>
                </tr>
            </tbody>
        </table>
    </div>
    <div id="unlocklist" style="float:left; height:100%; width:715px; overflow:auto;">
        <table id="unlocktab" class="tabsorternew" style="width:1200px;" cellspacing="1";>
            <thead>
                <tr>
                    <th style="width:200px;">姓名</th>
                    <th style="width:100px;">性别</th>
                    <th style="width:200px;">出生年月</th>
                    <th style="width:150px;">联系电话</th>
                    <th style="width:200px;">手机</th>
                    <th style="width:300px;">地址</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>熊世宏</td>
                    <td>男</td>
                    <td>1987/6/28</td>
                    <td>57575223</td>
                    <td>13917504761</td>
                    <td>上海市奉贤区金汇镇齐贤社区丽园小区</td>
                </tr>
                <tr>
                    <td>熊世宏</td>
                    <td>男</td>
                    <td>1987/6/28</td>
                    <td>57575223</td>
                    <td>13917504761</td>
                    <td>上海市奉贤区金汇镇齐贤社区丽园小区</td>
                </tr>
                <tr>
                    <td>熊世宏</td>
                    <td>男</td>
                    <td>1987/6/28</td>
                    <td>57575223</td>
                    <td>13917504761</td>
                    <td>上海市奉贤区金汇镇齐贤社区丽园小区</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<script>
    $(document).ready(function(){
        $('#btn_lock').click(function(){
            var _i=parseInt($('#col_num').val());
            var _t=$('#unlocktab thead th').eq(_i);
            
            var _trlist=$('#locktab tbody tr');
            $('#unlocktab tbody tr').each(function(i){
                _trlist.eq(i).append($(this).find('td').eq(_i));
            });
            
            
            $('#locktab').css('width',$('#locktab').width()+_t.width()-2+'px');
            $('#locklist').css('width',$('#locklist').width()+_t.width()-4+'px');
            $('#unlocktab').css('width',$('#unlocktab').width()-_t.width()-4+'px');
            $('#unlocklist').css('width',$('#unlocklist').width()-_t.width()-4+'px');
            
            
            $('#locktab thead tr').append(_t);
        });
    })
</script>
     
</asp:Content>









